﻿@model First_AG.Models.EmailModels

@{
    ViewBag.Title = "First Assembly of God";
  }
<body>

    @{ Html.RenderPartial("~/Views/Shared/Modified/Carousel.cshtml");}


    <!--The content under the carousel-->
    <div class="content">
       <div class="portfolio align-center container">
            <div class="headline">
                <h2>Groups</h2>
            </div>

            <div class="projects row-fluid">
                <div class="project pull-left">
                    <a class="project-thumb" href="#">
                        <img src="~/Content/images/icons/church/JAM.jpg" />
                    </a>

                    <h3>JAM Kids</h3>
                    <p>
                       
                    </p>
                </div>

                <div class="project pull-left">
                    <a class="project-thumb" href="#">
                        <img src="~/Content/images/icons/church/turning_point.jpg" />
                    </a>

                    <h3>Turning Point Youth</h3>
                    <p>//To do- make a accordian for all pictures</p>
                </div>


                <!--The Accordian that holds the little events-->
                <div class="project pull-left panel-group" id="accordion">
                    <div class="panel panel-default">
                        <div class="panel-heading">
                            <h4 class="panel-title">
                                <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
                                    Men's Breakfast
                                </a>
                            </h4>
                        </div>
                        <div id="collapseOne" class="panel-collapse collapse">
                            <div class="panel-body">
                               Needs a discription 
                            </div>
                        </div>
                    </div>
                    <div class="panel panel-default">
                        <div class="panel-heading">
                            <h4 class="panel-title">
                                <a data-toggle="collapse" data-parent="#accordion" href="#collapseTwo">
                                    Secret Sisters
                                </a>
                            </h4>
                        </div>
                        <div id="collapseTwo" class="panel-collapse collapse">
                            <div class="panel-body">
                               Needs a discription
                            </div>
                        </div>
                    </div>
                    <div class="panel panel-default">
                        <div class="panel-heading">
                            <h4 class="panel-title">
                                <a data-toggle="collapse" data-parent="#accordion" href="#collapseThree">
                                   Another group
                                </a>
                            </h4>
                        </div>
                        <div id="collapseThree" class="panel-collapse collapse">
                            <div class="panel-body">
                               Needs a discription
                            </div>
                        </div>
                    </div>
                </div>

               



            </div>
        </div><!--/.clients -->
    </div><!--/.content -->
   
</body>